import React from "react";
import ThemeProvider from "./Context";
import Left from "./Left";
import Right from "./Right";

class Section extends React.Component{
    render() {
        console.log(this)
        return <div>
            <h1>{this.props.title}</h1>
            {
                //类、函数组件以双标签的形式调用，可以在双标签内添加子元素，通过props拿到子元素并渲染，但如果不渲染，在双标签内的子元素是无效的
                this.props.children
            }
        </div>
    }
}

class App extends React.Component{
    render() {
        return <div>
            <Section title="积分榜">
                <ul>
                    <li>hello</li>
                </ul>
            </Section>
            <ThemeProvider>
                <Left />
                <Right />
            </ThemeProvider>
        </div>
    }
}

export default App;